package Avocado.form {

	import Avocado.util.AvocadoScrollBar;
	
	import com.greensock.TweenLite;
	import com.greensock.TweenMax;
	import com.greensock.easing.Sine;
	
	import fl.transitions.Tween;
	
	import flash.display.MovieClip;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.filters.DropShadowFilter;
	import flash.text.TextFormat;
	
	public class FormAcordeonSelector extends MovieClip {
		
		private var options:Array;
		private var txf:TextFormat;
		private var fWidth:Number;
		private var alignByCenter:Boolean = new Boolean(true);
		
		private var _bgColor:uint = 0xffffff;
		private var _dropShadow:DropShadowFilter = new DropShadowFilter(1.5, 45, 0x000000, .33, 3, 3, 1, 2, false, false, false);

		public var box:Sprite;
		public var aBox:Array = new Array;
		private var shadow:DropShadowFilter;
		
		public var lineHeight:Number = new Number(23);
		public var enterLineHeight:Number = new Number(1);
		public var overColor:uint = 0xf8dc1c;
		
		public function FormAcordeonSelector(_options:Array, _txf:TextFormat, _fWidth:Number, _alignByCenter:Boolean=true) {
			super();

			this.options = _options;
			this.txf = _txf;
			this.fWidth = _fWidth;
			this.alignByCenter = _alignByCenter;
			
			this.visible = false;
			this.alpha = 0;

			this.addEventListener(Event.ADDED_TO_STAGE, initThis);
		}
		
		
		/**
		 * 
		 * ***/
		public function get dropShadow():DropShadowFilter {
			return _dropShadow;
		}

		/**
		 * 
		 * ***/
		public function set dropShadow(value:DropShadowFilter):void {
			this.filters = [value];
			_dropShadow = value;
		}


		/**
		 * 
		 * ***/
		public function get bgColor():uint {
			return _bgColor;
		}

		/**
		 * 
		 * ***/
		public function set bgColor(value:uint):void {
			_bgColor = value;
		}

		
		/**
		 * 
		 * ***/
		public function close():void{
			if (alignByCenter == true) {
				TweenLite.to(this, .3, {autoAlpha: 0, ease: Sine.easeOut, scaleX: 0, scaleY: 0});
			} else {
				TweenLite.to(this, .3, {autoAlpha: 0, ease: Sine.easeOut, scaleX: 1, scaleY: 0});				
			}
			// this.visible = false;
		}


		/**
		 * 
		 * ***/
		public function open():void{
			if (alignByCenter == true) {
				TweenLite.to(this, .2, {autoAlpha: 1, ease: Sine.easeOut, scaleX: 1, scaleY: 1});
			} else {
				TweenLite.to(this, .2, {autoAlpha: 1, ease: Sine.easeOut, scaleX: 1, scaleY: 1});
			}
			// this.visible = true;
		}


		/**
		 * 
		 * ***/
		public function toggleVisible():void{
			if (this.visible == true){
				close();
			} else {
				open();
			}
		}
		

		
		/**
		 * 
		 * ***/
		private function initThis(e:Event):void {
			this.removeEventListener(Event.ADDED_TO_STAGE, initThis);
			
			setupOptions();
		}
		
		/**
		 * 
		 * ***/
		private function setupOptions():void {
			box = new Sprite;
			addChild(box);
			
			aBox = new Array;
			
			for (var a:* in options) {
				var tmp:FormField = new FormField(this.txf, this.fWidth, this.options[a].toString(), 256, this.bgColor); 
				tmp.lock();
				tmp.buttonMode = true;
				tmp.addEventListener(MouseEvent.MOUSE_OVER, overItem);
				tmp.addEventListener(MouseEvent.MOUSE_OUT, outItem);

				box.addChild(tmp);
				
				if (options[a+1]) {
					var line:Sprite = new Sprite;
					line.graphics.lineStyle(1, 0x000000, .11);
					line.graphics.moveTo(2,0);
					line.graphics.lineTo(tmp.width - 4, 0);
					line.y = lineHeight + enterLineHeight -1;
					tmp.addChild(line);
				}
				
				var clickMask:Sprite = new Sprite;
				clickMask.graphics.beginFill(0xffaaff, 0);
				clickMask.graphics.drawRect(getBounds(tmp).x, getBounds(tmp).y, getBounds(tmp).width, getBounds(tmp).height);
				clickMask.graphics.endFill();
				clickMask.name = this.options[a].toString();
				tmp.addChild(clickMask);

				aBox.push(tmp);
			}
			
			for (var a:* in aBox) {
				if (aBox[a-1]) {
					aBox[a].y = aBox[a-1].y + lineHeight + enterLineHeight;
				} else {
					aBox[a].y = 0;
				}
			}
			
			if (alignByCenter == true) {
				box.x = -(box.width/2);
				box.y = -(box.height/2);
			} else {
				box.x = 0;
				box.y = 0;
			}
			
			this.filters = [dropShadow];
		}

		/**
		 * 
		 * ***/
		private function overItem(e:MouseEvent):void {
			TweenMax.to(e.currentTarget, .3, {colorMatrixFilter:{colorize: overColor, amount: .33}});	
		}			
		
		/**
		 * 
		 * ***/
		private function outItem(e:MouseEvent):void {
			TweenMax.to(e.currentTarget, .7, {colorMatrixFilter:{colorize: overColor, amount:0}});
		}
		
		
	}
}